/*
 * @Author: feng.gan 675198494@qq.com
 * @Date: 2025-04-24 15:25:28
 * @LastEditors: feng.gan 675198494@qq.com
 * @LastEditTime: 2025-04-30 09:45:21
 * @FilePath: \vue3-demo\eslint.config.js
 * @Description: 支持 Vue 中 JSX 的 ESLint 配置
 */
import globals from 'globals';
import pluginJs from '@eslint/js';
import tseslint from 'typescript-eslint';
import pluginVue from 'eslint-plugin-vue';

export default [
  {
    ignores: ['node_modules', 'dist', '.git', '.idea', '.vscode'], // 忽略的文件或目录
  },
  {
    files: ['**/*.{js,mjs,cjs,ts,vue,jsx,tsx}'], // 添加对 JSX 和 TSX 文件的支持
    languageOptions: {
      ecmaVersion: 'latest', // 使用最新的 ECMAScript 版本
      sourceType: 'module', // 使用 ES 模块
      globals: {
        ...globals.browser, // 浏览器全局变量
        ...globals.node, // Node.js 全局变量
      },
    },
    rules: {
      ...pluginJs.configs.recommended.rules, // JavaScript 推荐规则
      ...tseslint.configs.recommended.rules, // TypeScript 推荐规则
      ...pluginVue.configs['flat/essential'].rules, // Vue 推荐规则
      'no-unused-vars': [2, { varsIgnorePattern: '^_' }], // 忽略以 `_` 开头的未使用变量
      'no-console': 'warn', // 将 console 提示改为警告
      'vue/multi-word-component-names': 'off', // 关闭 Vue 组件名称必须是多词的校验
    },
  },
  {
    files: ['**/*.vue'], // 针对 Vue 文件的额外配置
    languageOptions: {
      parserOptions: {
        parser: tseslint.parser, // 使用 TypeScript 解析器
        ecmaFeatures: {
          jsx: true, // 启用 JSX 支持
        },
      },
    },
    rules: {
      'vue/html-self-closing': [
        'error',
        {
          html: {
            void: 'always', // 空标签始终自闭合
            normal: 'never', // 非空标签不自闭合
            component: 'always', // 组件标签始终自闭合
          },
          svg: 'always',
          math: 'always',
        },
      ],
      'vue/html-closing-bracket-newline': [
        'error',
        {
          singleline: 'never', // 单行标签的结尾 > 不换行
          multiline: 'never', // 多行标签的结尾 > 不换行
        },
      ],
      'vue/max-attributes-per-line': [
        'error',
        {
          singleline: { max: 3 }, // 单行最多 3 个属性
          multiline: { max: 1 }, // 多行每行 1 个属性
        },
      ],
    },
  },
  {
    files: ['**/*.{jsx,tsx}'], // 针对 JSX/TSX 文件的额外配置
    languageOptions: {
      ecmaVersion: 'latest',
      sourceType: 'module',
      ecmaFeatures: {
        jsx: true, // 启用 JSX 支持
      },
    },
    rules: {
      'react/jsx-uses-vars': 'error', // 防止 JSX 中的变量被标记为未使用
    },
  },
];